<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<!--
			文档事件：
			1.加载成功事件：
			load
			window.onload=function(){
				
			}
			2.加载失败事件：
			error
			window.onerror=function(){
				
			}
			3.页面刷新或者离开的提示时间、
			window.onbeforeunload=function(){
			event.returnValue='';
			return"信息已经被更改是否确认厉害"
		}
	    2.焦点事件 ：
		失去焦点事件
		blur()
		获得焦点事件
		focus()	
			
		3.文档滚动事件：
		scrollTop标识文档的垂直滚动距离
		
		scrollLeft标识文档的水平滚动距离
		 		
		IE:document.documentElement.scrollTop/scrollLeft
		非IE:document.body.scrollTop/scrollLeft
		
			
		-->
	</head>
	<body>
		<input type="text" placeholder="提交数据"/>
		<span id="show1"></span>
		<button>提交按钮</button>
	</body>
	<script>
//		var input=document.querySelector('input');
//		var span1=document.getElementById('show1');
//		input.onfocus=function(){
//			input.placeholder='用户名必须在6-12位之间';
//		}
//		input.onblur=function(){
//			var lengths=input.value.length;
//			console.log(lengths)
//			if(lengths>=6&&lengths<=12){
//				span1.innerHTML='用户名合法';
//				span1.style.color='green';
//			}else{
//				span1.innerHTML='用户名不合法';
//				span1.style.color='red';
//			}
//		}
		
		
		
		
		
		
		/*
		 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * 
		 * */
	</script>
</html>
